{% extends "container.html" %}
{% block content %}
<div id="annotation_form">
    {% include "home/annotation_form.html" with form=form %}
</div>
<div id="response">
{% if not error %}
    <p>
        Preview: <br />
        <img id="preview_image" src="/retrieve/?fn={{preview_filename}}" />
    </p>
    <p><a href="/retrieve/?fn={{out_filename}}">
        Download Fullsize Image
    </a></p>
     
    <script type="text/javascript">
        $(document).ready(function(){
            $('#id_job_id').val('{{request_form.cleaned_data.job_id}}');
            $('#id_font_size').val('{{request_form.cleaned_data.font_size}}');
            $('#id_font_color').val('{{request_form.cleaned_data.font_color}}');
            $('#id_grid_color').val('{{request_form.cleaned_data.grid_color}}');
            $('#id_plot_grid_tick_scale').val('{{request_form.cleaned_data.plot_grid_tick_scale}}');
            $('#id_plot_grid_label_scale').val('{{request_form.cleaned_data.plot_grid_label_scale}}');
            if('{{request_form.cleaned_data.show_grid}}'=='False') {
                $('#id_show_grid').attr('checked', false);
                $('#id_grid_color').attr('disabled', true);
                $('#id_plot_grid_tick_scale').val('{{default_grid_tick_scale}}');
                $('#id_plot_grid_label_scale').val('{{default_grid_label_scale}}');
                $('#id_plot_grid_label_scale').attr('disabled', true);
                $('#id_plot_grid_tick_scale').attr('disabled', true);
            }
        });
    </script>

   <p><a href="/">Submit Another</a></p>
{% else %}
    <p class="error">Error: {{error}}</p>
    <script type="text/javascript">
        $(document).ready(function(){
            $('#id_font_size'.val('{{default_font_size}}');
            $('#id_plot_grid_tick_scale').val('{{default_grid_tick_scale}}');
            $('#id_plot_grid_label_scale').val('{{default_grid_label_scale}}');
        });
    </script>
{% endif %}
</div>
{% endblock %}
